<template>
    <div>
    <div style="" v-if="showShopInfo">
        <!--返回按钮和搜索按钮、店铺背景-->
        <span style="margin-top: 10px;font-size: 25px; position: absolute;z-index: 10">
<!--                    <van-icon name="arrow-left" @click="back"/>-->
        </span>
        <span style="margin-top: 10px;right: 10px; font-size: 25px; position: absolute;z-index: 10;">
<!--            <van-icon name="search" @click="searchGoods"/>-->
        </span>
<!--        <van-image width="100%" height="150" :src="shopMessage.logoSrc" style="position: relative"/>-->
  <div style="height:150px; width: 100%; background-color: #009be2; position: relative" ></div>

        <!--店面logo和相关信息-->
        <div style="top:80px;left: 135px;width: 80%;height: 100px;box-shadow:3px 3px 3px 2px rgba(0,0,0,.5);border-radius:10px;background-color: #fced6e;position: absolute;z-index: 10">
          <div style="display: inline-block; float: left;margin-top: 40px; margin-left: 20px">
            <van-icon name="arrow-left" @click="back"/>
          </div>
            <div style="width: 80px;display: inline-block; float: left;margin-top: 10px; margin-left: 400px">
                <van-image width="70" height="70" :src="shopMessage.logoSrc" round/>
            </div>
            <div style="width: 150px;display: inline-block;margin-left: 0px;margin-top:20px;float: left">
                <h3 style="margin: 0">{{shopMessage.shopName}}</h3>
<!--                <h6 style="margin: 0">月售{{shopMessage.totalSales}}</h6>-->
<!--                <h6 style="margin: 0">配送时间约{{shopMessage.deliveryTime}}分钟</h6>-->
                <span style="margin: 0;font-size: 5px">公告:{{shopMessage.desc}}</span>
            </div>
            <!--<div style="width:100px">
                <h5>销量：{{shopMessage.totalSales}}</h5>
            </div>-->
        </div>
        <div style="margin-top: 40px;background-color: white">
            <!--商品和评价标签页-->
            <van-tabs v-model="activeName" @click="hide(activeName)" style="background-color: white">
                <van-tab title="点餐" name="good" style="color: #409EFF">
                    <el-tabs tab-position="left" style="width:100%;margin-top: 10px; margin-bottom:0;height: 100%;">
                        <template v-for="(item,index1) in goodList" >
                            <el-tab-pane :label="item.categoryName" type="border-card">
                                <ul>
                                    <li v-for="(good,index2) in item.goods" :key="index2">
                                        <div style="border-radius: 10px;background-color:#fced6e;">
                                            <div style="display:inline-block;float: left">
                                                <img :src="good.goodPic" width="100" height="100" style="margin-left: 60px;margin-top: 6px">
                                            </div>
                                            <div>
                                              <div style="display: flex">
                                                <div style="width: 900px;margin-bottom: 15px;margin-top: 40px">{{good.goodName}}</div>
                                                <p style="width: 1500px;margin-bottom: 15px;margin-top: 40px">{{good.desc}}</p>
                                              </div>

<!--                                                <p style="width: 220px;font-size: 10px;margin-top: 0">月售: {{good.sales}}</p>-->
                                                <div style="width: 100%;font-size: 15px">
                                                    <span style="float: left;color: crimson;display: inline-block">￥{{good.price}}</span>
                                                    <!--<van-stepper style="margin:10px;display:inline-block;" :default-value="0" theme="round" button-size="15" disable-input @plus="add" @minus="reduce"/>-->
                                                    <template>
                                                        <button style="border-radius: 50%;border: solid 1px; float:right" @click="reduce(index1,index2)" v-show="good.count>0">-</button>
                                                        <input type="text" v-model="good.count"  style="border: none;width: 20px;text-align: center;float: right" disabled="true" v-show="good.count>0"/>
                                                        <button style="border-radius: 50%;border: solid 1px; margin-left:950px" @click="add(index1,index2)" >+</button>
                                                    </template>
                                                </div>
                                                <van-divider />
                                            </div>
                                        </div>

                                    </li>
                                </ul>
                            </el-tab-pane>

                        </template>
                    </el-tabs>
                   <!-- <template v-for="item in goodList.category" >
                        <el-tab-pane :label="item.name">
                            <ul v-for="good in item.goods">
                                <li>{{good.name}}</li>
                            </ul>
                        </el-tab-pane>
                    </template>-->
                    <!--<el-tab-pane label="用户管理" lazy>用户管理</el-tab-pane>
                    <el-tab-pane label="配置管理">配置管理</el-tab-pane>
                    <el-tab-pane label="角色管理">角色管理</el-tab-pane>
                    <el-tab-pane label="定时任务补偿">定时任务补偿</el-tab-pane>-->
                </van-tab>

                <van-tab title="评价" name="comment">
                  <template>
                    <div class="me-view-comment-write" v-show="true">
                      <el-input style="width:1200px"
                          @input="forceUpdate" v-model="content" placeholder="请输入">
                      </el-input>
                      <el-button style="background-color: #009be2; border: none;margin-left:8px;width:100px" @click="putComment(content)" type="text">评论</el-button>
                    </div>
                  </template>

                  <ul v-for="(comment) in commentList" >
                    <div class="me-view-comment-item" >
                      <div class="me-view-comment-author">
                        <div class="me-view-info">
                          <span class="me-view-nickname">用户：{{ comment.userName }}</span>
                          <p class="me-view-comment-content" >评价：{{ comment.content }}</p>
                        </div>
                      </div>
                    </div>
                  </ul>
                </van-tab>
              <van-tab class="me-view-nickname" style="margin-top:150px;font-size: 30px" title="评分" name="score">
                <div id="star">
                    <ul ref="star">
                        <li v-on:click="addscore(1)">☆</li>
                        <li v-on:click="addscore(2)">☆</li>
                        <li v-on:click="addscore(3)">☆</li>
                        <li v-on:click="addscore(4)">☆</li>
                        <li v-on:click="addscore(5)">☆</li>
                    </ul>
                    <span id="scorce">{{test.score}}分</span>
                </div>
              </van-tab>
                <van-tab title="商家" name="sell">
                  <div class="me-view-nickname" style="margin-top:150px;font-size: 30px">商家联系方式：{{ shopUser.phone }}</div>
                </van-tab>

            </van-tabs>
            <!--填充-->
            <div style="height:50px;display:block;"></div>
        </div>

        <!--购物车-->
        <div class="shoppingCartN" style="background-color: #fab865" v-if="shoppingCart">
           <div class="circleN" style="">
               <!--购物车为空时-->
               <div class="carN" style="background-color: #fced6e" v-if="totalCount===null" @click="showSelectedGoods">
                   <van-icon name="shopping-cart" size="30" color="#009be2" :badge="totalCount"/>
               </div>
               <!--购物车不为空时-->
               <div class="carN" style="background-color: #fced6e" v-if="totalCount > 0" @click="showSelectedGoods">
                   <van-icon name="shopping-cart" size="30" color="fced6b" :badge="totalCount"/>
               </div>
           </div>
            <div style="border-right: 1px solid #51575f;left:55px;width: 80px;height: 30px;display: inline-block;position: absolute;margin: 10px 5px;color: #70757b" v-if="totalPrice===0">
                ￥{{goodTotalPrice}}元
            </div>
            <div style="border-right: 1px solid #51575f;left:55px;width: 80px;height: 30px;display: inline-block;position: absolute;margin: 10px 5px;color: #fdfdfd" v-if="totalPrice>0">
                ￥{{goodTotalPrice}}元
            </div>
<!--            <div style="left:150px;color: #70757b;font-size: 12px;display:inline-block;position: absolute;margin:12px 0 0 5px;height: 44px">-->
<!--                另需配送费￥{{deliveryPrice}}-->
<!--            </div>-->
            <div style="float: right;width: 80px;">
                <van-button round size="large" style="background-color: white;font-size: 12px;margin-top: 5px;height: 40px;right: 30px" v-if="this.goodTotalPrice===0">请点餐</van-button>
                <van-button round size="large" style="color: white;background-color: #70757b;border-color: #70757b;font-size: 12px;margin-top: 5px;height: 40px" v-if="this.goodTotalPrice < this.minPrice">差￥{{minPrice-goodTotalPrice}}元起送</van-button>
                <van-button round type="warning" size="large" style="font-size: 12px;margin-top: 5px;height: 40px;background-color: #fced6e;right: 30px" v-if="this.goodTotalPrice >= this.minPrice" @click="toPay">去结算</van-button>
            </div>
        </div>

        <!--购物车详情-->
        <el-drawer
                :visible.sync="isShowSelectedGoods"
                direction="btt"
                :show-close="false"
                :with-header="false"
                :size="400"
        style="z-index: 10;">
            <div style="text-align: left">
                <van-tag color="#ffe1e1" text-color="#ad0000" ><span style="margin:10px;"> <van-icon name="cart" />已选商品</span></van-tag>

            </div>
        <div style="height: 500px">
                <template>
                        <ul >
                            <li v-for="(good,index) in selectedGoods" :key="index">
                                <div style="border-radius: 10px;background-color: white">
                                    <div style="display:inline-block;float: left">
                                        <img :src="good.goodPic" width="60" height="60" alt="">
                                    </div>
                                    <div>
                                        <h4 style="width: 160px;margin-bottom: 2px;margin-top: 10px">{{good.goodName}}</h4>
                                        <div style="width: 100%;font-size: 15px;margin-top: 20px;height: 20px">
                                            <span style="float: left;color: crimson;display: inline-block;margin-left: 20px">￥{{good.price*good.count}}</span>
                                            <div style="float: right;margin-right:10px">
                                                <button style="border-radius: 50%;border: solid 1px" @click="reduceCar(index)" v-show="good.count>0">-</button>
                                                <input type="text" v-model="good.count"  style="border: none;width: 20px;text-align: center" disabled="true" v-show="good.count>0"/>
                                                <button style="border-radius: 50%;border: solid 1px; left: 0" @click="addCar(index)" >+</button>
                                            </div>
                                        </div>
                                        <van-divider />
                                    </div>
                                </div>

                            </li>
                        </ul>

                </template>
            <!--填充-->
            <div style="height:50px;display:block;"></div>
        </div>
        <div>

        </div>
        </el-drawer>
    </div>

        <!--确认订单页面-->
        <div style="width: 100%;background-color:white;z-index: 99999;float:center" v-if="showPay" class="order">
            <div class="content">
              <van-nav-bar
                  title="确认订单"
                  left-text="返回"
                  left-arrow
                  @click-left="isShowPay"
                  style="height: 50px; background-color: #009be2"
              />
              <van-notice-bar
                  left-icon="volume-o"
                  text="节约粮食，从我做起，从现在做起。请适量点餐，避免浪费"
              />
              <div style="background-color:#fced6e;width: 1200px;;margin: 80px;border-radius: 10px;border: solid 1px">
                <div style="width: 300px;margin-bottom: 30px;">
                  <!--                    <span v-if="addressMessage===null"><h3 style="display:inline-block;margin-bottom:0;margin-top: 5px;margin-left: 5px;margin-right: 10px">请选择座位</h3></span>-->
                  <!--                    <span v-if="addressMessage!==null">-->
                  <!--                        <div style="font-size: 13px;width: 150px;display: inline-block;">-->
                  <!--                            <div>-->
                  <!--                                {{addressMessage.address}}-->
                  <!--                            </div>-->
                  <!--                            <div>-->
                  <!--                                <span>-->
                  <!--                                    {{addressMessage.name}}-->
                  <!--                                </span>-->
                  <!--                                    {{addressMessage.tel}}-->
                  <!--                                <span>-->
                  <!--                            </span>-->
                  <!--                            </div>-->
                  <!--                        </div>-->

                  <!--                    </span>-->
                  <!--                    <span style="margin-left: 120px;"><van-icon name="arrow" @click="chooseAddress"/></span>-->
                </div>
                <!--                <div style="width: 300px;height: 40px;margin: 0;">-->
                <!--                    <span><h4 style="display:inline-block;margin-bottom:0;margin-top: 5px;margin-left: 5px;margin-right: 50px">预计送达时间</h4></span>-->
                <!--                    <span style="margin-left: 50px;"><van-icon name="clock-o" />12:50 <van-icon name="arrow" @click="chooseTime"/></span>-->

                <!--                </div>-->
               <div style="display: flex;align-items: center;justify-content: center">
                 <div style="width: 1200px;height: 50px;margin: 10px;">
                   <span><h4 style="display:inline-block;margin-bottom:0;margin-top: 5px;margin-left: 1px;margin-right:600px">支付方式<van-icon name="arrow" @click="choosePayType"/></h4></span>
                 </div>
                 <div style="width: 300px;display: flex; padding: 10px 40px; flex-direction: row;align-items: center;justify-content: center">
                   <div id="changeColor1" style="padding: 0 20px;flex-direction: row" @click="changeColor(1)">微信</div>
                   <div id="changeColor2" style="padding: 0 20px;" @click="changeColor(2)">支付宝</div>
                   <div id="changeColor3" @click="changeColor(3)">银行卡</div>
                 </div>
               </div>
                </div>

              <div style="background-color:#fced6e;width: 1200px;margin: 80px;border-radius: 10px;border: solid 1px">
                <template>
                  <ul >
                    <li v-for="(good,index) in selectedGoods" :key="index">
                      <div style="border-radius: 10px;height: 140px">
                        <div style="display:inline-block;float: left;margin-left: 80px;margin-top: 12px">
                          <img :src="good.goodPic" width="120" height="120">
                        </div>
                        <div style="display: flex;padding: 56px">
                          <div style="padding: 0 60px;width: 500px;">{{good.goodName}}</div>
                          <div style="padding: 0 10px;color: crimson;font-size: 30px;margin-left: 19%;">×{{good.count}}</div>
                          <div style="padding: 0px 10px 0px 80px;color: crimson;font-size: 30px">￥{{good.price*good.count}}</div>
<!--                          <h4 style="width: 450px;margin-bottom: 80px">{{good.goodName}}</h4>-->
<!--                          <div style="width: 100%;font-size: 30px;margin-top: 20px;height: 20px">-->
<!--                            <span style="float: left;color: crimson;display: inline-block;margin-left: 500px">×{{good.count}}</span>-->
<!--                            <div style="float: right;margin-right:100px">-->
<!--                              <span style="float: left;color: crimson;display: inline-block;margin-left: 20px">￥{{good.price*good.count}}</span>-->
<!--                            </div>-->
<!--                          </div>-->
                          <van-divider />
                        </div>
                      </div>
                    </li>
                  </ul>
                  <!--                    <div>-->
                  <!--                        <h4 style="width: 50px;margin-left: 10px;display: inline-block;margin-right: 180px;margin-top: 5px;margin-bottom: 5px">配送费</h4>-->
                  <!--                        <span>￥{{deliveryPrice}}</span>-->
                  <!--                    </div>-->

                </template>
              </div>
              <!--填充-->
              <div style="height:50px;display:block;"></div>

              <!--总价格+结算按钮-->
              <div style="width:100%; height: 50px;bottom: 0; position: fixed;background-color: #009be2; z-index: 100">
                <van-submit-bar :price="(goodTotalPrice*100+deliveryPrice*100)" button-text="提交订单" @submit="submit" button-type="warning" style="background-color: #009be2"/>
              </div>
            </div>
        </div>

        <!--选择收货地址页面-->
        <div v-if="showAddress">
            <div>
                <slot><van-nav-bar
                        title="地址列表"
                        left-text="返回"
                        left-arrow
                        @click-left="backPay"
                /></slot>
                <van-address-list
                        v-model="chosenAddressId"
                        :list="addressList"
                        @add="onAdd"
                        @select="onSelect"
                />
            </div>
        </div>

        <!--添加收货地址页面-->
        <div v-if="showAddAddress">
            <slot>
              <van-nav-bar
                    title="新的地址"
                    left-text="返回"
                    left-arrow
                    @click-left="backChooseAddress"
            /></slot>
            <van-address-edit
                    :area-list="areaList"
                    show-set-default
                    :area-columns-placeholder="['请选择', '请选择', '请选择']"
                    @save="onSave"
            />
            <!--遮挡板-->
            <div style="width:100%; height: 50px;bottom: 0; position: fixed;background-color: #ffffff; z-index: 100" v-if="showAddAddress">
            </div>
            <!--:search-result="searchResult"
            :search-result="searchResult"-->
        </div>


        <!--付款页面-->
       <!-- <div v-if="showPayMoney">
            <slot><van-nav-bar
                    title="付款页面"
                    left-text="返回"
                    left-arrow
                    @click-left="backPay"
            /></slot>
            &lt;!&ndash;遮挡板&ndash;&gt;
            <div style="width:100%; height: 50px;bottom: 0; position: fixed;background-color: #ffffff; z-index: 100" v-if="showPayMoney">

            </div>
        </div>-->
    </div>

</template>
<style scoped>
/deep/.el-tabs__item.is-active {
  color: #0b8ee5;
}
.van-button--warning {
  background-color: #fced6e;
}
    /*购物车为空时*/
    .shoppingCartN{
        width:100%;
        height: 50px;
        bottom: 0;
        position: fixed;
        background-color:#141d27;
        z-index: 9999;
    }
    .circleN{
        margin-left:10px; width: 60px;height: 60px; background-color: #141d27;text-align: center;border-radius: 50%;position: absolute;bottom: 0;
      background-color: #009be2;
    }
    .carN{
        margin-top: 10px;background-color: #2b343c;border-radius: 50%;width: 40px;height: 40px;margin-left: 10px
    }
  /*.order {*/
  /*position: relative;*/
  /*}*/
  /*.content {*/
  /*  position: absolute;*/
  /*  top: 100px;*/
  /*  right: 500px;*/
  /*}*/
    .minPriceDesc {
        font-size: 12px;
        font-weight: 700;
        line-height: 48px;
    }
    .not-enough {
        background: #2b333b;
    }
    .enough{
        background:#00b43c;
        color:#fff
    }

    #star ul{
      margin-right: 40px;
      display: inline;
    }
  
    #star ul li{
      display:inline;
      margin:0 10px;
      cursor:pointer;
    }
    #star .act{
      color: #ff2a27;
    }
    /deep/.el-tabs__item{
      color: black;
    }
</style>

<style>
  .me-view-comment-item {
    margin-top: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0;
  }
  .me-view-comment-author {
    margin: 10px 0;
    vertical-align: middle;
  }

  .me-view-nickname {
    font-size: 14px;
  }

  .me-view-comment-content {
    line-height: 1.5;
  }
  ::v-deep .van-tabs__nav--line {
    background-color: white;
  }
.van-tab{
  background-color: white;
}
</style>
<script>

    import Toast from "vant/lib/toast";
    import { Dialog } from 'vant';
    import { areaList } from '@vant/area-data';

    export default {
        name: "Shop",
        created(){
          console.log("进入店铺"+this.$route.params.shop.sid);
          this.axios.get("http://localhost:8084/findAllGoodsBySid",{
              params:{
                  sid: this.$route.params.shop.sid
              }
          }).then(resp=>{
              //console.log(resp.data)
              this.goodList = resp.data;
          });
          this.axios.get("http://localhost:8084/findShopBySid",{
              params:{
                  sid: this.$route.params.shop.sid
              }
          }).then(resp=>{
              this.shopMessage = resp.data;
              this.minPrice = 0;
              this.deliveryPrice = 0;
              console.log("店铺信息："+JSON.stringify(resp.data))
          })
          this.axios.get("http://localhost:8084/getComment",{
            params:{
              sId:this.$route.params.shop.sid
            }
          }).then(resp=>{
            console.log(resp.data);
            this.commentList = resp.data;
          });

          this.axios.get("http://localhost:8084/getShopUser",{
            params:{
              sid:this.$route.params.shop.sid
            }
          }).then(resp=>{
            console.log(resp.data);
            this.shopUser = resp.data;
          });
          // this.axios.get("http://localhost:8084/addStar",{
          //   params:{
          //     sid:this.$route.params.shop.sid
          //   }
          // }).then(resp=>{
          //   console.log(resp.data);
          //   this.shopUser = resp.data;
          // });
        },
        computed:{
            /*计算商品总价格*/
            goodTotalPrice(){
                let goodTotalPrice = 0;
                this.goodList.forEach(function (item) {
                    item.goods.forEach(function (good) {
                        goodTotalPrice+= good.count*good.price;
                    })
                });
                return goodTotalPrice;
            },

            /*存放在购物车里的商品*/
            selectedGoods() {
                //存放good
                let goods = [];
                this.goodList.forEach(function (item) {
                    item.goods.forEach(function (good) {
                        if(good.count>0){
                            goods.push(good);
                        }
                    })
                });
                return goods;
            },


        },
        data(){
            return{
                /*存储订单信息*/
                /*uid:this.uid,
                    sid:this.shopId,
                    totalPrice:this.totalPrice,
                    goods:this.selectedGoods,
                    addressMessage:this.addressMessage,
                    deliveryPrice:this.deliveryPrice,*/
                orderInfo:{
                    uid:'',
                    sid:'',
                    goodTotalPrice:'',
                    deliveryPrice: '',
                    totalPrice:'',
                    goods:'',
                    // addressMessage:'',
                    shopName:''
                },
                title:'',
                /*显示店铺主页面*/
                showShopInfo:true,
                showPayMoney:false,

                /*所选择的收货地址*/
                addressMessage:null,

                /*默认显示请选择收货地址*/
                showChooseAddress:true,
                areaList,
                showAddAddress:false,
                showAddress:false,
                showPay:false,

                /*用来保存新增的address信息*/
                addressInfo:{
                    /*(aId=0, areaCode=null, name=null, tel=null, addressDetail=null, province=null, city=null, county=null, uid=1)*/
                    uid: this.$store.getters.getUser.id,
                    areaCode:"",
                    name:"",
                    tel:"",
                    addressDetail:"",
                    province:"",
                    city:"",
                    county:""
                },

                /*总商品个数*/
                totalCount:null,

                /*多少元起送*/
                minPrice:0,

                /*当前总价：商品总价+配送费*/
                totalPrice:0,

                /*配送费*/
                deliveryPrice:0,

                shoppingCart:true,
                count:0,
                hider:false,
                activeKey:"a",
                activeName:'good',
                shopId:this.$route.params.shop.sid,
                //当前登录用户id
                uid:this.$store.getters.getUser.id,
                isShowSelectedGoods:false,
                chosenAddressId: 0,
                createTime:'',
                /*店铺信息*/
                shopMessage:'',

                addressList: [
                    {
                        id: '1',
                        name: '张三',
                        tel: '13000000000',
                        areaCode:'130105',
                        address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
                        isDefault: true,
                    },
                    {
                        id: '2',
                        name: '李四',
                        tel: '1310000000',
                        address: '浙江省杭州市拱墅区莫干山路 50 号',
                    },
                ],

                /*商品列表*/
                goodList: [
                        {
                            categoryName:"优惠套餐",
                            goods:[
                                {
                                    gid:'',
                                    goodName:"法式汉堡",
                                    desc:'法国现做汉堡',
                                    goodPic:'pic/dinner.png',
                                    price:'1',
                                    sales:'100',
                                    cid:'',
                                    sid:'',
                                    count:0
                                }
                            ]
                        }/*,
                        {
                            categoryName:"中式套餐",
                            goods:[
                                {
                                    name:"全家桶1",
                                    desc:'法国现做汉堡',
                                    pic:'pic/dinner.png',
                                    price:'5',
                                    salesMonth:'100',
                                    count: 0
                                }
                            ]
                        },
                        {
                            categoryName:"风味小吃",
                            goods:[
                                {
                                    name:"肉串1",
                                    desc:'法国现做汉堡',
                                    pic:'pic/dinner.png',
                                    price:'7',
                                    salesMonth:'100',
                                    count: 0
                                }
                            ]
                        },
                        {
                            categoryName:"烧烤",
                            goods:[
                                {
                                    name:"骨肉相连1",
                                    desc:'法国现做汉堡',
                                    pic:'pic/dinner.png',
                                    price:'5',
                                    salesMonth:'100',
                                    count: 0
                                }
                            ]
                        }*/
                    ],
                commentList:[],
                shopUser:{
                  phone:"",
                },
                content:"",
                test:{
                    score:0
                }
            }
        },
        methods:{
          forceUpdate() {
            this.$forceUpdate()
          },
          // 发评论
            putComment(content){
              const that = this;
              this.axios.get("http://localhost:8084/putComment",{
                params:{
                  content:content,
                  uId:this.uid,
                  sId:this.$route.params.shop.sid,
                }
              }).then(()=>{

                Toast("评论成功");
                this.content=""
                this.axios.get("http://localhost:8084/getComment",{
                  params:{
                    sId:this.$route.params.shop.sid
                  }
                }).then(resp=>{
                  console.log(resp.data);
                  this.commentList = resp.data;
                });
              });
            },
            /*提交订单,显示支付中加载框*/
            submit(){
                // if(this.addressMessage === null){
                //     Toast("请选择收货地址");
                //     return;
                // }
                const that = this;
                const orderInfo = this.orderInfo;
                this.orderInfo.uid = that.uid;
                this.orderInfo.sid = that.shopId;
                this.orderInfo.goodTotalPrice = that.goodTotalPrice;
                this.orderInfo.deliveryPrice = 0;
                this.orderInfo.totalPrice = (that.goodTotalPrice*1.0);
                this.orderInfo.addressMessage = that.addressMessage;
                this.orderInfo.shopName = that.shopMessage.shopName;
                this.orderInfo.goods = that.selectedGoods;
                console.log(this.orderInfo);

                //确认提示
                Dialog.confirm({
                    title: this.title+'支付',
                    message: '确认支付吗？',
                }).then(() => {
                        // on confirm
                        //Toast("提交订单");
                        const toast = Toast.loading({
                            duration: 2000,
                            forbidClick: true,
                            message: "支付中..."
                        });
                        setTimeout(()=>{
                            /*将订单信息发给后端*/
                            this.axios.post("http://localhost:8084/createOrder",this.orderInfo)
                                .then(resp=>{
                                    if(resp.data !== null){
                                        console.log(resp.data.orderNumber);
                                        this.$router.push({
                                                name: "paySuccess",
                                                params:{
                                                    oid:resp.data.oid,
                                                    orderNumber:resp.data.orderNumber,
                                                    goodTotalPrice:resp.data.goodTotalPrice,
                                                    deliveryPrice:0,
                                                    totalPrice:resp.data.totalPrice,
                                                    goods:this.selectedGoods,
                                                    addressMessage:this.addressMessage,
                                                    shopName:this.shopMessage.shopName,
                                                    orderStat:resp.data.orderStat,
                                                    createTime:resp.data.createTime
                                                }
                                            });
                                    }else {
                                        Toast("由于网络或其他原因，创建订单失败！！！")
                                    }
                        })
                        },2000);
                });

            },

            /*选择收货地址*/
            onSelect(item){
                console.log(item);
                this.addressMessage = item;
                console.log(this.addressMessage);
                this.showAddress = false;
                this.showPay = true;
            },

            /*新增收货地址*/
            onSave(item){
                /*let addressInfo = JSON.stringify(item);
                console.log(addressInfo);
                Toast(addressInfo);*/
                this.addressInfo.areaCode = item.areaCode;
                this.addressInfo.name = item.name;
                if(this.addressInfo.province===this.addressInfo.city){
                    this.addressInfo.addressDetail = item.province+""+item.county+""+item.addressDetail;
                }else {
                    this.addressInfo.addressDetail = item.province+""+item.city+""+item.county+""+item.addressDetail;
                }
                this.addressInfo.tel = item.tel;
                this.addressInfo.province = item.province;
                this.addressInfo.city = item.city;
                this.addressInfo.county = item.county;
                console.log(this.addressInfo.addressDetail);
                //console.log(this.addressInfo);
                this.axios.post("http://localhost:8084/addAddress",
                    this.addressInfo
                ).then(resp=>{
                    console.log("sucess");
                    Toast("添加成功！！！");
                    setTimeout(()=>{
                        this.showAddAddress = false;
                        this.chooseAddress();
                    },2000);

                })
            },

            /*添加收货地址页面*/
            onAdd(){
                this.showAddAddress = true;
                this.showAddress = false;
            },

            /*返回选择收货地址*/
            backChooseAddress(){
              this.showAddress = true;
              this.showAddAddress = false;
            },

            /*返回订单界面*/
            backPay(){
                this.showPayMoney = false;
                this.showAddress = false;
                this.showPay = true;
            },

            /*点击选择收货地址，获取所有收货地址*/
            chooseAddress(){
              //Toast("选择收货地址");
              const that = this;
              this.axios.get("http://localhost:8084/listAddress",{
                  params:{
                      uid:that.shopId
                  }
              }).then(resp=>{
                      console.log(resp.data);
                      this.addressList = resp.data;
                      this.showPay = false;
                      this.showAddress = true;
              });

            },

            /*选择送达时间*/
            chooseTime(){
                Toast("选择送达时间")
            },

            /*选择支付方式*/
            choosePayType(){
                Toast("选择支付方式")
            },

            /*返回店铺主页*/
            isShowPay(){
              this.showPay=false;
              this.showShopInfo = true;
            },

            /*显示购物车详情*/
            showSelectedGoods(){
                this.isShowSelectedGoods = true;
            },

            /*在购物车详情页面进行商品的修改*/
            addCar(index){
                this.selectedGoods[index].count++;
                this.totalCount++;
            },


            reduceCar(index){
                this.selectedGoods[index].count--;
                this.totalCount--;
            },


            /*去结算界面*/
            toPay(){
                console.log("进入结算界面");
                this.showPay=true;
                this.showShopInfo = false;

                /*this.goodList.category.forEach(function (item) {
                    item.goods.forEach(function (good) {
                        if(good.count>0){
                            console.log(good)
                        }
                    })
                });*/
                /*console.log(this.selectedGoods);*/
                //this.$router.push({path:'/pay'});
            },


            /*遮盖*/
            hide(index){
              if(index==='good'){
                  this.shoppingCart = true;
                  this.hider = false;
                  console.log("进入点餐界面")
              }else if(index==='comment'){
                  this.shoppingCart = false;
                  this.hider = true;
                  console.log("进入评论界面")
              }else if(index==='score'){
                  this.shoppingCart = false;
                  this.hider = true;
                  console.log("进入评分界面")
                  this.searchscore();
              }else if(index==='sell'){
                  this.shoppingCart = false;
                  this.hider = true;
                  console.log("进入商家界面")
              }
            },


            /*点击添加按钮*/
            add(index1,index2){
                let totalCount = null;
                const good = this.goodList[index1].goods[index2];
                good.count++;
                this.totalCount ++;
                //Toast(this.goodList.category[index1].goods[index2].count);
            },

            /*点击减少按钮*/
            reduce(index1,index2){
                const good = this.goodList[index1].goods[index2];
                good.count--;
                this.totalCount--;
                if(this.totalCount===0){
                    this.totalCount = null;
                }
                //Toast(this.goodList.category[index1].goods[index2].count);

            },

            /*返回上一页*/
            back(){
                //this.$router.push('../views/user/Search.vue')
                //this.$router.go(-1);
                //this.$router.replace({name:'search'})
                history.go(-1)
            },

            showItem(){
              console.log(this.goodList[0])
            },

            searchGoods(){
              console.log("搜索")
            },
            /*购物车结算状态*/
            payDesc() {
                if (this.totalPrice === 0) {
                    return `￥${this.minPrice}元起送`;
                } else if (this.totalPrice < this.minPrice) {
                    let differPrice = this.minPrice - this.totalPrice;
                    return `还差${differPrice}元起送`;
                } else if (this.totalPrice >= this.minPrice) {
                    return '去结算';
                }
            },
      addscore(index){
        var div=document.getElementById('star');
        var ul=div.childNodes.item(0);
        var lis=ul.childNodes;
        for(var i=0;i<index;i++){
            lis[i].className = 'act';
        }
        for(var i=index;i<5;i++){
            lis[i].className = '';
        }
        document.getElementById("scorce").innerText=index+"分"
        this.axios.get("http://localhost:8084/addStar",{
        params:{
            star:index,
            sid:this.$route.params.shop.sid
        }
        }).then(resp=>{
            if(resp.data === "success"){
                this.$message({
                message:"提交成功！！！",
                type:'success'
                });
            }else{
                this.$message({
                message:"提交失败！！！",
                type:'warning'
                });
            }
        })
        },
        searchscore(){
                this.axios.get("http://localhost:8084/findStar",{
                    params:{
                        sid:this.$route.params.shop.sid
                    }
                }).then(resp=>{
                    console.log(resp.data);
                    var index=resp.data;
                    document.getElementById("scorce").innerText=index+"分"
                    var div=document.getElementById('star');
                    var ul=div.childNodes.item(0);
                    var lis=ul.childNodes;
                    for(var i=0;i<index;i++){
                        lis[i].className = 'act';
                    }
                    for(var i=index;i<5;i++){
                        lis[i].className = '';
                    }
                })
            },
            changeColor(id) {
                    if (id === 1) {
                        document.getElementById("changeColor1").style.color = "red";
                        document.getElementById("changeColor2").style.color = "black";
                        document.getElementById("changeColor3").style.color = "black";
                        this.title="微信";
                    } else if (id === 2) {
                        document.getElementById("changeColor1").style.color = "black";
                        document.getElementById("changeColor2").style.color = "red";
                        document.getElementById("changeColor3").style.color = "black";
                        this.title="支付宝";
                    } else if (id === 3) {
                        document.getElementById("changeColor1").style.color = "black";
                        document.getElementById("changeColor2").style.color = "black";
                        document.getElementById("changeColor3").style.color = "red";
                        this.title="银行卡";
                    }
            }
      }
    }

</script>


